<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<head>
    <meta charset="utf-8">
    <title>安全协议设计工具</title>
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" type="text/css" href="css/identify.css" />
    <link rel="stylesheet" type="text/css" href="css/layout.css" />
    <link rel="stylesheet" type="text/css" href="css/account.css" />
    <link rel="stylesheet" type="text/css" href="css/style.css" />
    <link rel="stylesheet" type="text/css" href="css/control_index.css" />

    <link rel="stylesheet" type="text/css" href="css/easyui.css">
    <link rel="stylesheet" type="text/css" href="css/icon.css">
    <link rel="stylesheet" type="text/css" href="css/demo.css">
    <link rel="stylesheet" href="font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="css/stylesheet.css" />
    <link rel="stylesheet" type="text/css" href="css/myProtocol.css" />
    <link rel="stylesheet" type="text/css" href="css/protocolDesignDetail.css" />
    <link rel="stylesheet" type="text/css" href="css/common.css"/>

    <script type="text/javascript" src="js/md5.min.js"></script>
    <script type="text/javascript" src="js/jsencrypt.min.js"></script>
    <script type="text/javascript" src="js/aes.js"></script>
    <script src="js/jquery-1.7.2.min.js"></script>
    <script type="text/javascript" src="js/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="js/layer.js"></script>
    <script type="text/javascript" src="js/select.js"></script>
    <script type="text/javascript" src="js/haidao.validate.js"></script>
    <script type="text/javascript" src="js/service.js"></script>
    <script type="text/javascript" src="js/haidao.offcial.general.js"></script>


    <style type="text/css">
        #code{
            width: 50%;
            height: 40px;
            outline: none;
            border: none;
            background-color: transparent;
            font-size: 16px;
            font-family:Arial;
            font-style:italic;
            font-weight:bold;
            border:0;
            letter-spacing:2px;
            color:blue;
        }
    </style>

</head>

<body>
<div class="view-topbar">
    <div class="topbar-console">
        <div class="tobar-head fl">
            <a href="#" class="topbar-home-link topbar-btn text-center fl">
                <img src="images/dwlogo.png"  class="logoimg"/>
            </a>
            <div  class="mynav" >
                <span>电力监控协议安全设计工具</span>
            </div>
        </div>
    </div>
    <div class="topbar-info">
        <ul class="fr">
            <li class="fl topbar-info-item">
                <div class="dropdown">
                    <a href="#" class="topbar-btn">
                        <span class="fl text-normal"><span id="usrname" class="username"></span> </span>
                        <span class="icon-arrow-down"></span>
                    </a>
                    <ul class="dropdown-menu topbar-btn-fontsize">
                        <li>
                            <a id="myLogout">退出</a>
                        </li>
                    </ul>
                </div>
            </li>
        </ul>
    </div>
</div>

<div class="view-body">
    <div class="view-sidebar">
        <div class="sidebar-content">

        </div>
    </div>

    <div class="view-product background-color">

        <ul class="accound-bund">
            <li class="clearfix">
                <p class="bund-class" style="font-size:24px;margin-top: 30px">为不影响使用，请您先修改密码！</p>

                <p class="" style="font-size:24px;margin-top: 30px">安全性高的密码可以使账号更安全，建议您定期更换密码，设置一个包含字母，符号或数字中至少两项且长度超过8位的密码。</p>

                <p class="" style="font-size:24px;margin-top: 30px">
							<!-- <i class="icon icon-been-set fl"></i> -->
                    <!-- <em class="margin-right text-green-deep">已设置</em> -->
                    <!-- | -->
							<a href="#" data-panel="modify_pass" data-title="修改密码--(密码长度8-16位，包括至少1个大写字母，1个小写字母，1个数字)" data-callback="$(&quot;#modify_pass&quot;).submit();"
                               data-btn="下一步,取消" class="button-word1 btn_ajax_open">修改</a>
							<input data-panel="modify_pass2" data-title="修改密码-修改完成" data-btn="完成" data-callback="layer.closeAll();" class="modify_pass_setup2 btn_ajax_open"
                                   value="第三步" type="hidden">
						</p>
            </li>

        </ul>
    </div>
    <!--弹窗-->
    <!--修改密码-->
    <div class="modify_pass" style="display: none;">
        <dl class="layout modify-identity" style="display: block;">
            <dt class="step4">
						<span class="w50 active">
							<em class="icon-index">1</em>
							<em>修改密码</em>
						</span>
                <span class="w50">
							<em class="icon-index">2</em>
							<em>修改成功</em>
						</span>
            </dt>
            <form name="modify_pass" id="modify_pass" onsubmit="console.log('提交成功')">
                <dd>
                    <ul>
                        <li class="clearfix">
                            <span class="revise-left">旧密码：</span>
                            <span class="revise-right">
										<input class="input input-pass fl" id="old" datatype="*" placeholder="请输入您的旧密码" type="password" onfocus="removeOldPwdText()" onblur="checkOldPwd()">
									</span>
                        </li>
                        <li class="clearfix">
                            <span class="revise-left">新密码：</span>
                            <span class="revise-right">
										<input class="input input-pass fl" id="password" datatype="*6-15" placeholder="请输入您的新密码" type="password" onfocus="removeNewPwdText()" onblur="checkNewPwd()">
									</span>
                        </li>
                        <li class="clearfix">
                            <span class="revise-left">确认新密码：</span>
                            <span class="revise-right">
										<input class="input input-pass fl" id="confirmpwd" datatype="*" recheck="password" placeholder="请再次输入您的新密码" type="password" onfocus="removeConfirmPwdText()" onblur="checkConfirmPwd()">
									</span>
                        </li>
                        <li class="clearfix">
                            <span class="revise-left"><canvas id="canvas" width="70" height="34" onclick="createCode()"></canvas></span>
                            <!--<span class="revise-left"><input type = "button" id="code" onclick="createCode()"/></span>-->
                            <span class="revise-right">
										<input class="input input-pass fl" id="codeInput" datatype="*" placeholder="请输入验证码" onfocus="removeCodeText()">
									</span>
                        </li>
                    </ul>
                </dd>
            </form>
        </dl>
    </div>
    <div class="modify_pass2" style="display: none;">
        <dl class="layout modify-identity" style="display: block;">
            <dt class="step5">
						<span class="w50">
							<em class="icon-index">1</em>
							<em>修改密码</em>
						</span>
                <span class="w50 active">
							<em class="icon-index">2</em>
							<em>修改成功</em>
						</span>
            </dt>
            <dd>
                <span class="success clearfix"><em>恭喜您，密码已成功修改！请重新登录</em></span>
            </dd>
        </dl>
    </div>
</div>

</body>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/admin.js"></script>


</html>